<template>
	<view class="proposalView">
		<view class="box_title">
			<text>大家都在搜</text>
		</view>

		<view class="box_list">
			<ul>
				<li v-for="(item, index) in list" :key="index" @click="$emit('search-value',item)">
					{{ item }}
				</li>
			</ul>
		</view>
	</view>
</template>

<script>
	export default {
		name: "SearchProposal",
		data() {
			return {
				list: [],
			};
		},
		created: function() {
			uni.request({
				url: `https://food.boohee.com/fb/v1/keywords`,
				success: (res) => {
					this.list = res.data.keywords;
				}
			})
		},
	}
</script>

<style lang="scss" scoped>
	.proposalView {
		margin: 20px 0;
		font-size: 14px;

		.box_title {
			padding: 10px 15px;
			text-align: left;
			color: #999999;
		}

		.box_list {
			background: white;

			ul {
				display: flex;
				justify-content: space-between;
				flex-wrap: wrap;
				padding: 0;
				list-style: none;
				li {
					padding: 0 15px;
					box-sizing: border-box;
					width: 50%;
					height: 50px;
					line-height: 50px;
					text-align: left;
					border-top: 1px solid #c9c9c9;

					&:nth-last-of-type(1) {
						border-bottom: 1px solid #c9c9c9;
					}

					&:nth-last-of-type(2) {
						border-bottom: 1px solid #c9c9c9;
					}
				}
			}
		}
	}
</style>
